import Vue from 'vue'
import Router from 'vue-router'
import Config from '@/settings'
import NProgress from 'nprogress' // progress bar
import 'nprogress/nprogress.css' // progress bar style

Vue.use(Router)

NProgress.configure({
  showSpinner: false
}) // NProgress Configuration
// #### 路由映射

export const constantRouterMap = [
  // 404页面
  {
    path: '/404',
    component: (resolve) => require(['@/views/features/404'], resolve),
    hidden: true
  },
  // 401页面
  {
    path: '/401',
    component: (resolve) => require(['@/views/features/401'], resolve),
    hidden: true
  },
  // 重定向页面
  {
    path: '/redirect',
    component: (resolve) => require(['@/App.vue'], resolve),
    hidden: true,
    children: [{
      path: '/redirect/:path*',
      component: (resolve) => require(['@/views/features/redirect'], resolve)
    }]
  },
  // ---------view--------- 
  // 登录
  {
    path: '/login(\\.html)?/',
    meta: {
      title: '登录',
      noCache: true
    },
    component: (resolve) => require(['@/views/login'], resolve),
    hidden: true
  },
  // 注册
  {
    path: '/register(\\.html)?/',
    meta: {
      title: '注册',
      noCache: true
    },
    component: (resolve) => require(['@/views/register'], resolve),
    hidden: true
  },

  // 前端页面
  {
    path: '/',
    component: (resolve) => require(['@/views/front/Main.vue'], resolve),
    // 重定向
    redirect: '/index(\\.html)?/',
    children: [
      // ----------------------商城页面
      {
        path: "/index(\\.html)?/",
        meta: {
          title: '商城首页',
          noCache: true
        },
        component: () => import("@/views/front/Index")
      },
      {
        path: '/about(\\.html)?/',
        meta: {
          title: '关于',
          noCache: true
        },
        component: () => import("@/views/front/About")
      },
      {
        path: '/cart(\\.html)?/',
        meta: {
          title: '购物车',
          noCache: true
        },
        component: () => import("@/views/front/Cart")
      },
      {
        path: '/checkout(\\.html)?/',
        component: () => import("@/views/front/Checkout")
      },
      {
        path: '/contact(\\.html)?/',
        meta: {
          title: '联系我们',
          noCache: true
        },
        component: () => import("@/views/front/Contact")
      },
      {
        path: '/news-details(\\.html)?/',
        component: () => import("@/views/front/NewsDetails")
      },
      {
        path: '/news(\\.html)?/',
        component: () => import("@/views/front/News")
      },
      {
        path: '/product-details(\\.html)?/',
        meta: {
          title: '商品详情',
          noCache: true
        },
        component: () => import("@/views/front/ProductDetails")
      },
      {
        path: '/products(\\.html)?/',
        meta: {
          title: '商品',
          noCache: true
        },
        component: () => import("@/views/front/Products")
      },
      {
        path: '/payment(\\.html)?/',
        meta: {
          title: '支付',
          noCache: true
        },
        component: () => import("@/views/front/Payment")
      },
      // ------------------用户中心
      {
        path: 'user(\\.html)?/',
        component: (resolve) => require(['@/views/home/User'], resolve),
        name: 'Home',
        hidden: true,
        meta: {
          title: '个人中心',
          icon: 'home',
          affix: true,
          noCache: true
        },
        children: [{
          path: 'center',
          component: (resolve) => require(['@/views/home/Center'], resolve),
          name: 'Center'
        }, {
          path: 'address',
          component: (resolve) => require(['@/views/home/Address'], resolve),
          name: 'Address'
        }, {
          path: 'order',
          component: (resolve) => require(['@/views/home/Order'], resolve),
          name: 'Order'
        }, {
          path: 'reviews',
          component: (resolve) => require(['@/views/home/Reviews'], resolve),
          name: 'Reviews'
        }, {
          path: 'wallet',
          component: (resolve) => require(['@/views/home/Wallet'], resolve),
          name: 'Wallet'
        }, ]
      },
    ]
  },

  // 后台管理
  {
    // 当 子路由 匹配成功，
    // 子路由中的component 会被渲染在 父路由component 的 <router-view> 中
    path: '/dashboard(\\.html)?/',
    component: (resolve) => require(['@/views/system/Dashboard'], resolve),
    name: 'Dashboard',
    hidden: true,
    meta: {
      title: '后台管理页面',
      icon: 'home',
      affix: true,
      noCache: true
    },
    children: [{
      path: 'admin',
      component: (resolve) => require(['@/views/system/Admin'], resolve),
      name: 'Admin'
    }, {
      path: 'user',
      component: (resolve) => require(['@/views/system/User'], resolve),
      name: 'User'
    }, {
      path: 'category',
      component: (resolve) => require(['@/views/system/Category'], resolve),
      name: 'Category'
    }, {
      path: 'goods',
      component: (resolve) => require(['@/views/system/Goods'], resolve),
      name: 'Goods'
    }, {
      path: 'orders',
      component: (resolve) => require(['@/views/system/Orders'], resolve),
      name: 'Orders'
    }, {
      path: 'earnings',
      component: (resolve) => require(['@/views/system/Earnings'], resolve),
      name: 'Earnings'
    }, ]
  },


]

const router = new Router({
  // mode: 'hash',
  mode: 'history',
  scrollBehavior: () => ({
    y: 0
  }),
  routes: constantRouterMap
})

// #### 导航守卫
// to: Route: 即将要进入的目标 路由对象
// from: Route: 当前导航正要离开的路由
// 白名单
// const whiteList = ['/login', '/register', '/401', '/404', '/redirect'] // no redirect whitelist
// 用户可访问页面
// const userList = ['/Index', '/About', '/Cart', '/Checkout', '/Contact', 'News', 'NewsDetails', 'ProductDetails', 'Products']
router.beforeEach((to, from, next) => {
  // console.log(to.path)
  if (to.meta.title) {
    document.title = to.meta.title + ' - ' + Config.title
  }
  NProgress.start()
  const username = localStorage.getItem("NAME")
  const uid = localStorage.getItem("UID")
  // 拦截要前往后台的路由
  if (/\/dashboard/.test(to.path)) {
    // 前往后台
    // console.log(`/login?redirect=${to.fullPath}`)
    if (username == "root") {
      next()
      // NProgress.done()
    } else {
      console.log("重定向")
      // next()
      next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
      NProgress.done()
    }
  } else if (/\/payment/.test(to.path) || /\/user/.test(to.path)) {
    // 前往支付之前,在用户进入结算页面时进行拦截
    if (username != null && username != undefined && uid) {
      next()
      NProgress.done()
    } else {
      console.log("重定向")
      // next()
      next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
      NProgress.done()
    }
  } else {
    next()
    NProgress.done()
  }
  // 如果是从支付页返回结算页,则重定向到购物车?
  if (to.path == '/checkout.html' && from.path == '/payment') {
    next(`/cart.html`)
    NProgress.done()
  }
})

router.afterEach(() => {
  NProgress.done() // finish progress bar
})
export default router